import { Routes } from '@angular/router';
import { Entry } from '@core/models';
import { CustomFormControlComponent } from './custom-form-controls.component';
import { StarRatingComponent } from './star-rating-demo/star-rating.component';

export const routes: Routes = [
  {
    path: '',
    component: CustomFormControlComponent,
    children: [
      {
        path: 'star-rating',
        component: StarRatingComponent,
        // data: { showRating: true, scale: 5 },
      },
      {
        path: 'star-rating-demo',
        loadComponent: () =>
          import(
            './star-rating-demo/star-rating-demo.component'
          ),
      },
      {
        path: 'character-selection',
        loadComponent: () =>
          import(
            './character-selector-demo/character-selector.component'
          ),
      },
      {
        path: 'character-selection-demo',
        loadComponent: () =>
          import(
            './character-selector-demo/character-selector-demo.component'
          ),
      },
    ],
  },
];

export const pages: Entry[] = [
  {
    link: './star-rating',
    params: { showRating: 'true', scale: '5' },
    title: 'Rating',
  },
  {
    link: './star-rating-demo',
    title: 'Rating Demo',
  },
  {
    link: './character-selection',
    title: 'Characters',
  },
  {
    link: './character-selection-demo',
    title: 'Characters Demo',
  },
];

export default routes;
